<!--修改专家信息表单-->
<template>
    <div class="expert-info-container">
        <el-form label-width="80px" :model="form">
            <el-form-item label="真实姓名">
                <el-input v-model="form.realName" style="width:290px;"></el-input>
            </el-form-item>
            <el-form-item label="手机号">
                <el-input v-model="form.phone" style="width:290px;"></el-input>
            </el-form-item>
            <el-form-item label="从事专业">
                <el-input v-model="form.profession" style="width:290px;"></el-input>
            </el-form-item>
            <el-form-item label="职位">
                <el-input v-model="form.position" style="width:290px;"></el-input>
            </el-form-item>
            <el-form-item label="所属单位">
                <el-input v-model="form.belong" style="width:290px;"></el-input>
            </el-form-item>
        </el-form>
        <div style="text-align:center;margin-right:130px;">
            <el-button type="success" @click="update">修改</el-button>
        </div>
    </div>
</template>

<script setup>
import { getExpertInfo, editExpertInfo } from '@/api/expert.js'
import { ElMessage } from 'element-plus';
import { ref } from 'vue'

const form = ref({
    userName: '',
    realName: '',
    phone: '',
    profession: '',
    position: '',
    belong: ''
})

const load = () => {
    getExpertInfo().then(res => {
        console.log(res);
        form.value = res.data
    })
}
load()


//专家信息修改
const update = () => {
    editExpertInfo(form.value).then(res => {
        if (res.flag) {
            ElMessage.success('修改成功');
        } else {
            ElMessage.error('修改失败');
        }
    })
}


</script>

<style lang="scss" scoped>
.expert-info-container {
    width: 900px;
    height: 100%;
    background: #fff;
    padding: 10px 20px;
}
</style>